<template>
  <view class="wrapper">
    <view class="content">
      <u-cell-group>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex ">
            <view class="w-100 c-99"> 编号: </view>
            <view class="flex-1">
              <u--input
                v-model="datalist.code"
                placeholder="请输入编号"
                border="none"
              ></u--input>
            </view>
          </view>
        </u-cell>

        <u-cell arrow-direction="right">
          <view slot="title" class="flex ">
            <view class="w-100 c-99"> 名称: </view>
            <view class="flex-1">
              <u--input
                v-model="datalist.name"
                placeholder="请输入名称"
                border="none"
              ></u--input>
            </view>
          </view>
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex " @click="fabricYarnShows = true">
            <view class="w-150 c-99"> 布匹/纱线: </view>
            <view class="flex-1">
              {{ datalist.typeName }}
            </view>
          </view>
        </u-cell>

        <u-cell arrow-direction="right">
          <view slot="title" class="flex ">
            <view class="w-100 c-99"> 欠款: </view>
            <view class="flex-1">
              <u--input
                type="number"
                v-model="datalist.originDebt"
                placeholder="请输入欠款"
                border="none"
              ></u--input>
            </view>
          </view>
        </u-cell>

        <u-cell arrow-direction="right">
          <view
            slot="title"
            class="flex "
            @click="
              btnSelectGoods(
                '/pages/application/pages/cloth/converter/converter-add/components/category'
              )
            "
          >
            <view class="w-100 c-99"> 分类: </view>
            <view class="flex-1">
              {{ datalist.catName }}
            </view>
          </view>
        </u-cell>

        <u-cell arrow-direction="right">
          <view slot="title" class="flex " @click="storeShows = true">
            <view class="w-100 c-99"> 门店: </view>
            <view class="flex-1">
              {{ datalist.shopName }}
            </view>
          </view>
        </u-cell>

        <u-cell arrow-direction="right">
          <view slot="title" class="flex ">
            <view class="w-150 c-99"> 是否启用: </view>
            <view class="flex-1">
              <u-switch v-model="datalist.isEnable"></u-switch>
            </view>
          </view>
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex ">
            <view class="w-150 c-99"> 是否批次: </view>
            <view class="flex-1">
              <u-switch
                v-model="datalist.isBatchNumber"
              ></u-switch>
            </view>
          </view>
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex ">
            <view class="w-251 c-99"> 是否启用负库存: </view>
            <view class="flex-1">
              <u-switch
                v-model="datalist.isNegStock"
              ></u-switch>
            </view>
          </view>
        </u-cell>
        <u-cell arrow-direction="right">
          <view slot="title" class="flex ">
            <view class="w-100 c-99"> 备注: </view>
            <view class="flex-1">
              <u--input
                v-model="datalist.remarks"
                placeholder="请输入内容"
                border="none"
              ></u--input>
            </view>
          </view>
        </u-cell>
      </u-cell-group>
    </view>
    <!-- 门店 -->
    <cxPopupNotification
      :type="datalist.shopId"
      :clothArray="weightColumns"
      :show="storeShows"
      @onLikeClose="(() =>{storeShows = false})"
      @onCheck="
        (e) => {
          (datalist.shopName = e.label),
            (datalist.shopId = e.value),
            (storeShows = false);
        }
      "
    >
    </cxPopupNotification>
    <!-- 布匹/纱线 -->
     <cxPopupNotification
      :type="datalist.typeId"
      :clothArray="orgTypeOptionColumns"
      :show="fabricYarnShows"
      @onLikeClose="(() =>{storeShows = false})"
      @onCheck="
        (e) => {
          (datalist.typeName = e.label),
            (datalist.typeId = e.value),
            (fabricYarnShows = false);
        }
      "
    >
    </cxPopupNotification> 

  </view>
</template>

<script>
import clIcon from "@/components/cl-icon/cl-icon.vue";
import { getVoDataById } from "@/apis/inventory/converter";
import cxPopupNotification from "@/components/cx-popup-notification/cx-popup-notification";
import {
  getMenDianData,
  getKeHuTypeData,
} from "@/apis/bill/information/custom";
export default {
  components: {
    clIcon,
    cxPopupNotification
  },
  data() {
    return {
      fabricYarnShows: false,
      storeShows: false,
      config: {
        title: "产品",
        color: "#ffffff",
        //背景颜色;参数一：透明度（0-1）;参数二：背景颜色（array则为线性渐变，string为单色背景）
        backgroundColor: [1, ["#409EFF", "#409EFF", "#60b4f6", "#60b4f6"]],
      },
      datalist: {
        code: "", // 编号
        name: "", //名称
        typeId: 1, // 布匹id
        typeName: "布匹", // 布匹name
        catId: "", // 分类
        catName: null, // 分类name
        shopId: "1597506542394015744", //门店id
        shopName: "总店", // 门店name
        // "settlementTypeId": "", // 结款方式
        // "settlementTypeName": "", // 结款name
        isEnable: true, // 是否启用
        isBatchNumber: false, // 是否批次
        isNegStock: false, // 是否负库存
        remarks: "", // 备注
        originDebt: null, // 欠款
        labelList: null, //标签
      },
    };
  },
  computed: {},
  watch: {},
  created() {
        this.getMenDianDatas();
    this.getOrgTypeOptionsDatas();
    uni.$on("category", (data) => {
      this.datalist.catId = data.id;
      this.datalist.catName = data.name;
    });
    // uni.$on('on-payment-method', data => {
    //   this.datalist.settlementTypeId = data.id
    //   this.datalist.settlementTypeName = data.name

    // })
  },
  onReady() {},
  methods: {
    // 获取纱线
    getOrgTypeOptionsDatas() {
      getKeHuTypeData().then((res) => {
        if (!res.flag) return;
        const data = res.data || {};
        this.orgTypeOptionColumns = data;
      });
    },
    // 获取门店
    getMenDianDatas() {
      getMenDianData().then((res) => {
        if (!res.flag) return;
        const data = res.data || {};
        this.weightColumns = data;
      });
    },
    getDataItem(id) {
      getVoDataById(id).then((res) => {
        if (!res.flag) return;
        const data = res.data || {};
        this.datalist = Object.assign(this.datalist, data);
      });
    },
    btnSelectGoods(url) {
      if (!url) return;
      this.$Router.push({
        path: url,
      });
    },
  },
  beforeDestroy() {
    uni.$off("category");
    // uni.$off("on-payment-method")
  },
};
</script>

<style lang="scss" scoped>
.wrapper {
  // height: 100%;
  background-color: #fff;

  .content {
    flex: 1;
    overflow-y: scroll;
  }

  .btns {
  }
}
</style>